<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        const arr = [
            { id: 'a', pid: '', name: '总裁办' },
            { id: 'b', pid: '', name: '行政部' },
            { id: 'c', pid: '', name: '财务部' },
            { id: 'd', pid: 'c', name: '财务核算部' },
            { id: 'e', pid: 'c', name: '税务管理部' }
        ];
        console.log(fn1(arr, ''));

        const fn1 = (list, rootId) => {
            // list => 完整的一份数据
            // rootId => ''
            const arr = [];
            list.forEach(item => {
                // 第一次循环
                // item => { id: 'a', pid: '', name: '总裁办' }
                // item => { id: 'b', pid: '', name: '行政部' }
                // item => { id: 'c', pid: '', name: '财务部', children: [{ id: 'd', pid: 'c', name: '财务核算部' }{ id: 'e', pid: 'c', name: '税务管理部' }] }
                if (item.pid === rootId) {

                    const children = fn2(list, item.id);
                    if (children.length) {
                        item.children = children;
                    }
                    arr.push(item);
                }
            });
            return arr;
        };

        /* [
            { id: 'a', pid: '', name: '总裁办' },
            { id: 'b', pid: '', name: '行政部' },
            {
                id: 'c', pid: '', name: '财务部',
                children: [
                    { id: 'd', pid: 'c', name: '财务核算部' },
                    { id: 'e', pid: 'c', name: '税务管理部' }
                ]
            }
        ] */




















        const fn2 = (list, rootId) => {
            // list => 完整的一份数据
            // rootId => 'c'
            const arr = [];
            // 有没有 pid 等于 c 的
            list.forEach(item => {
                if (item.pid === rootId) {
                    // item => { id: 'd', pid: 'c', name: '财务核算部' }
                    // item => { id: 'e', pid: 'c', name: '税务管理部' }
                    const children = fn3(list, item.id);
                    if (children.length) {
                        item.children = children;
                    }
                    arr.push(item);
                }
            });
            return arr;
        };
























        const fn3 = (list, rootId) => {
            // rootId => 'e'
            const arr = [];
            // 有没有 pid 等于 e 的
            list.forEach(item => {
                if (item.pid === rootId) {
                    // 代码执行不会用到 fn4，所以没有定义 fn4 也不会出错
                    const children = fn4(list, item.id);
                    if (children.length) {
                        item.children = children;
                    }
                    arr.push(item);
                }
            });
            return arr;
        };
























    </script>
</body>

</html>